<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>个人中心 / 我的配置 / 数据分配 / 页面</title>
    <!-- easyui js 文件 -->
    <script src="../../frame/jquery-easyui-1.8.3/jquery.min.js"></script>
    <script src="../../frame/jquery-easyui-1.8.3/jquery.easyui.min.js"></script>
    <script src="../../frame/jquery-easyui-1.8.3/locale/easyui-lang-zh_CN.js"></script>

    <!-- 打开窗口 -->
    <script src="../../common/js/openWin.js"></script>

    <!-- easyui 自带的 material-teal 样式  -->
    <link rel="stylesheet" href="../../frame/jquery-easyui-1.8.3/themes/material-teal/easyui.css">

    <!-- mtips -->
    <script src="../../frame/mtips/mtips.js"></script>
    <link rel="stylesheet" href="../../frame/mtips/mtips.css">

    <!-- 拖拽 -->
    <script type="text/javascript" src="../../common/js/datagrid-dnd.js"></script>

    <!-- 自定义 样式文件 -->
    <link rel="stylesheet" href="../../common/css/my.base.css">
    <link rel="stylesheet" href="../../common/css/my.icons.css">

    <link rel="stylesheet" href="pc.css">
</head>

<body class="detail_cfg">
    <div class="easyui-layout" data-options="fit:true">
        <!-- 待分配数据 -->
        <div title="待分配数据" data-options="region:'west',collapsible:false"
             style="width:46%" class="tree-box">
            <!-- 工具栏 -->
            <div id="tb1" class="flex_toolbar">
                <form>
                    <div class="form_row">
                        <div class="col_item">
                            <label>关键字:</label>
                            <input type="text" class="easyui-textbox sm_width">
                        </div>
                        <div class="col_item">
                            <a href="javascript:;" class="easyui-linkbutton btn_sm"
                               data-options="iconCls:'icon-search-primary'">搜索</a>
                        </div>
                    </div>
                </form>
            </div>
            <table></table>
        </div>
        <!-- buttons -->
        <div data-options="region:'center',border:false">
            <div class="operator">
                <div class="operatorBtn">
                    <button class="assignBtn toRight" title="分配已选数据"></button>
                    <button class="assignBtn toLeft" title="删除已选数据"></button>
                </div>
            </div>
        </div>
        <!-- 已分配数据 -->
        <div title="已分配数据" data-options="region:'east',collapsible:false"
             style="width:46%">
            <!-- 工具栏 -->
            <div id="tb2" class="flex_toolbar">
                <form>
                    <div class="form_row">
                        <div class="col_item">
                            <label>关键字:</label>
                            <input type="text" class="easyui-textbox sm_width">
                        </div>
                        <div class="col_item">
                            <a href="javascript:;" class="easyui-linkbutton btn_sm"
                               data-options="iconCls:'icon-search-primary'">搜索</a>
                        </div>
                    </div>
                </form>
            </div>
            <table></table>
        </div>
    </div>
    <script>
        $(function () {
            $('table').each(function (tabIdx, table) {
                $(table).datagrid({
                    rownumbers: true,
                    singleSelect: true,
                    url: '../../common/data/datagrid_data3.json',
                    method: 'get',
                    fit: true,
                    pagination: true,
                    toolbar: '#tb' + (tabIdx+1),
                    columns: [[
                        { field: 'ck', checkbox: 'true' },
                        { field: 'taskname', sortable: true, width: 160, title: '流程名字' },
                        { field: 'status', sortable: true, width: 80, title: '启用' },
                        { field: 'taskid', sortable: true, width: 160, title: '审批状态' },
                        { field: 'emg', sortable: true, width: 160, title: '审批' },
                        { field: 'init', sortable: true, width: 160, title: '专业领域' },
                    ]]
                });
            })
        })
    </script>
</body>

</html>